<template>
  <div style="background-color: white;text-align: center">
      <div class="text-lg" style="padding-top: 5%"><text>{{this.date}}</text></div>
      <div class="text-black text-bold text-sl text-price padding-sm"><text>{{this.salesVolume}}</text></div>
    <div class="flex justify-around" style="width: 100%">
      <div class="margin-xs radius" style="width: 50%;padding-left: 10%">
        <div class="text-lg" style="text-align: center;"><text style="color: #666666;">收款笔数</text></div>
        <div class="text-lg padding-sm" style="text-align: center;"><text style="color: #666666;">{{this.transactionsNum}}</text></div>
      </div>
      <div class="margin-xs radius" style="width: 50%;padding-right: 10%">
        <div class="text-lg" style="text-align: center;"><text style="color: #666666;">毛利</text></div>
        <div class="text-lg padding-sm" style="text-align: center;"><text class="text-price" style="color: #666666;">{{this.gross}}</text></div>
      </div>
    </div>

    <div class="cu-bar solid-bottom" style="text-align: left;padding-left: 3%">
      <text class="text-xl" style="color: #494949">订单流水</text>
    </div>

    <div class="cu-list">
      <div class="cu-item flex margin-left-sm margin-right-sm padding-top padding-bottom solid-bottom" v-for="payLog in businessIncomeDetail" :key="payLog.orderId" @click="onClick(payLog)">
        <div class="flex-sub" style="text-align: left;">
          <div>
            <text class="text-xl" style="color: #505050">{{payLog.payment}}</text>
          </div>
          <div>
            <text class="text-sm text-grey">{{getTime(payLog.createTime)}}</text>
          </div>
        </div>
        <div class="flex-sub " style="text-align: right;padding-top: 3%">
          <text class="text-price text-lg text-bold" style="color: #5b5b5b;padding-right: 3%">{{payLog.total}}</text>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import dateTimeUtils from "../../utils/dateTimeUtils";
import request from "../../utils/request";

export default {
    name: "CollectionDetail",
    data(){
        return{
            date:"",
          salesVolume:0.0,
          transactionsNum:0,
          gross:0.0,
          businessIncomeDetail: [],
        }
    },
    onLoad:function (option) {
        uni.setNavigationBarTitle({
            title: '收款详情'
        });
        this.date=option.date
      this.salesVolume=option.salesVolume
      this.transactionsNum=option.transactionsNum
      this.gross=option.gross
      const year=new Date().getFullYear()
      const date=year+"-"+option.date+"T00:00:00"

        let endDate=new Date(date)
        endDate=dateTimeUtils.dateTimePlusMinus(endDate,1)
        endDate=dateTimeUtils.dateTimeFormat(endDate)

        request.post("/business/get/businessSalesFlow",{
          startDate: date,
          endDate: endDate,
          storeId: uni.getStorageSync("currentStoreMain").storeId
        }).then(res=>{
          for (let i in res.data){
            if (res.data[i].isDone===1){
              this.businessIncomeDetail.push(res.data[i])
            }
          }
          this.businessIncomeDetail.sort(function (a, b) {
            return b.createTime.localeCompare(a.createTime)
          })
        })
    },

  methods:{
      getTime:function (dateTime) {
        return dateTime.split("T")[1]
      },

    onClick:function (order){
        uni.navigateTo({
            url:"/pages/collection/OrderDetail",
            success:function (res){
                res.eventChannel.emit("order",order)
            }
        })


    }
  }
}
</script>

<style scoped>

</style>